<template>
  <el-card class="box-card">
    <div slot="header" class="clearfix">
      <span>文件库</span>
      <el-link @click="change(1)" style="float: right; padding: 3px 0">国家文件</el-link>
      <span style="float: right; padding: 3px 0">|</span>
      <el-link @click="change(2)" style="float: right; padding: 3px 0">省级文件</el-link>
      <span style="float: right; padding: 3px 0">|</span>
      <el-link @click="change(2)" style="float: right; padding: 3px 0">高校文件</el-link>

    </div>
    <div v-for="item in items" :key="item.id" class="text item">
      <span>{{item.message}}</span>
      <span style="float: right; padding: 3px 0">{{item.time}}</span>
      <hr/>
    </div>
  </el-card>
</template>

<script>
    export default {
        name: "FileLiu",
      data(){
          return{
            items:[{
              id:1,
              message:"　9月13日至14日，中共中央总书记、国家主席、中央军委主席习近平在陕西省榆林市考察",
              time:"2021-09-13"
            },
              {
                id:2,
                message: "关于进一步落实领导干部带头在公共场所禁烟的通知",
                time: "2015-05-16"
              },
              {
                id: 3,
                message: "国务院关于加强审计工作的意见",
                time: "2015-08-20"
              },
              {
                id:4,
                message: "中共中央办公厅、国务院办公厅印发《关于严禁党政机关到风景名胜区开会的通知》",
                time: "2015-05-16"
              },
              {
                id:5,
                message: "党政领导干部选拔任用工作条例",
                time: "2015-05-16"
              },
              {
                id:6,
                message:"关于进一步规范信访事项手里办理程序引导来访人依法逐级走访的办法",
                time:"2015-08-20"
              },
              {
                id:7,
                message:"党政机关理性节约反对浪费条例",
                time:"2015-05-16"
              }]
          }
      },
      methods:{
          change(index){
            console.log(index);
          }
      }
    }
</script>

<style scoped>
  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 10px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    width: 750px;
  }
</style>
